

import "react-simpletabs/dist/react-simpletabs.css"
import "react-virtualized/styles.css"
import "./sass/app.scss"
import 'react-date-picker/index.css'

var isNode = !((
      typeof window !== 'undefined' &&
        window.document && window.document.createElement
    ));
// var React = isNode ? require('react') : window.React
//   , ReactDOM = isNode ? require('react-dom') : window.ReactDOM;
import _ from 'lodash'
import React from 'react'
import ReactDOM from 'react-dom'
import { createStore, combineReducers, applyMiddleware } from 'redux'
import { reducer as formReducer } from 'redux-form'
import { Provider } from 'react-redux'
import { Router, Route, IndexRoute, browserHistory } from 'react-router'
import { syncHistoryWithStore, routerReducer } from 'react-router-redux'
import ReduxThunk from 'redux-thunk'
import * as reducers  from './reducers'
import { fromJS } from 'immutable'

import Header from './components/Header'
import MainPanel from './components/MainPanel'
import SysSettingPanel from './components/SysSettingPanel'
import MenuSettingPanel from './components/MenuSettingPanel'
import MessageSettingPanel from './components/MessageSettingPanel'
import NewsPushPanel from './components/newspush/NewsPushPanel'
import AssetSettingPanel from './components/assets/AssetSettingPanel'
import Sidebar from "./components/Sidebar"
import AssetSettingEditorPanel from './components/assets/AssetSettingEditorPanel'
import DemoSettingPanel from './components/demo/DemoSettingPanel'
import LoginPanel from './components/login/Login'
import SysRolePanel from './components/sysrole/SysRolePanel'
import CenterSettingPanel from './components/usercenter/CenterSettingPanel'
import PropertySettingPanel from './components/property/PropertySettingPanel'
import UserSettingPanel from './components/users/UserSettingPanel'
import BackgroundSettingPanel from './components/backgroundUsers/BackgroundSettingPanel'
import BillSettingPanel from './components/bill/BillSettingPanel'
import BillManagerPanel from './components/billHistory/BillSettingPanel'
import BillboardSettingPanel from './components/billboard/BillboardSettingPanel'
import WechatUserSettingPanel from './components/wechatUsers/WechatUserSettingPanel'
import TemplateSettingPanel from './components/templates/TemplateSettingPanel'
import DeliverySettingPanel from './components/delivery/DeliverySettingPanel'
import SuggestionSettingPanel from './components/suggestions/SuggestionSettingPanel'
import UnitSettingPanel from './components/units/UnitSettingPanel'
import PushMessageSettingPanel from './components/pushMessage/PushMessageSettingPanel'
import WorkPanel from './components/work/WorkPanel'
import WorkBillPanel from './components/workBill/WorkBillPanel'
import WechatLinkPanel from './components/wechatLink/WechatLinkPanel'

const initialState = !isNode && window.__INITIAL_STATE__
const initialReduxState = !isNode && window.__INITIAL_REDUX_STATE__

//import reducers from '<project-path>/reducers'



var App = React.createClass({
  getInitialState: function(){
    return {};
  },

  handleClick: function () {
    alert('You clicked!')
  },

  render: function() {

    var childProps = this.props.initialState || {};
    return (

      <div className="rootWrapper" id="rootWrapper" style={{ height: "100%", display:'block'}}>
        <div style={{display:'none', position: 'relative', width: '100%', height: '100%', background: '#000', zIndex: "10000"}}>
        </div>
        <Sidebar style={{display:'block'}} initialState={this.props.initialState}/>
        <Header username={this.props.initialState.username} avatar={this.props.initialState.avatar}
              wechat={this.props.initialState.wechat} name={this.props.initialState.name}/>
        { this.props.children && React.cloneElement( this.props.children, childProps ) }
      </div>
    )
  }
})

var routes = (<Route path="/" component={App}>
                <IndexRoute component={MainPanel} />
                <Route path="/syssetting" component={SysSettingPanel}/>
                <Route path="/menusetting" component={MenuSettingPanel}/>
                <Route path="/messagesetting" component={MessageSettingPanel}/>
                <Route path="/newspush" component={NewsPushPanel}/>
                <Route path="/assetsetting" component={AssetSettingPanel}/>
                <Route path="/assetsettingeditor" component={AssetSettingEditorPanel} />
                <Route path="/demo" component={DemoSettingPanel} />
                <Route path="/sysRole" component={SysRolePanel} />
                <Route path="/usercenter" component={CenterSettingPanel}/>
                <Route path="/user" component={UserSettingPanel}/>
                <Route path="/property" component={PropertySettingPanel}/>
                <Route path="/backgroundUsers" components={BackgroundSettingPanel}/>
                <Route path="/bill" components={BillSettingPanel}/>
                <Route path="/billManager" components={BillManagerPanel}/>
                <Route path="/billboard" components={BillboardSettingPanel}/>
                <Route path="/wechatUser" component={WechatUserSettingPanel}/>
                <Route path="/templates" component={TemplateSettingPanel} />
                <Route path="/delivery" component={DeliverySettingPanel}/>
                <Route path="/suggestions" component={SuggestionSettingPanel}/>
                <Route path="/unit" component={UnitSettingPanel}/>
                <Route path="/pushMessage" component={PushMessageSettingPanel} />
                <Route path="/work" component={WorkPanel} />
                <Route path="/wechatLink" component={WechatLinkPanel} />
                <Route path="/workBill" component={WorkBillPanel}/>
              </Route>)

if (isNode) {

  exports.routes = routes

} else {
  // Transform into Immutable.js collections,
  // but leave top level keys untouched for Redux
  Object
    .keys(initialReduxState)
    .forEach(key => {
      initialReduxState[key] = fromJS(initialReduxState[key]);
     });
  // Add the reducer to your store on the `routing` key
  const store = applyMiddleware(ReduxThunk)(createStore)(
    combineReducers(
      _.assign(reducers, {
        routing: routerReducer,
        form: formReducer
      })
    ),
    initialReduxState,
    window.devToolsExtension && window.devToolsExtension() //For use with redux-devtools
  )

  // Create an enhanced history that syncs navigation events with the store
  const history = syncHistoryWithStore(browserHistory, store)

  var createElementFn = function (Component, props) {
    return <Component initialState={initialState} {...props} />
  };

  ReactDOM.render((
    <Provider store={store}>
      { /* Tell the Router to use our enhanced history */ }
      <Router history={history} createElement={createElementFn}>
        {routes}
      </Router>
    </Provider>
  ), document.getElementById('react-root') )
}
